<template>
	<view class="like-icon" @click.stop="likeTap">
		<uni-icons size="20" color="#f07373" :type="like?'heart-filled':'heart'"></uni-icons>
	</view>
</template>

<script>
export default {
	data() {
		return {
			like: false
		};
	},
	created() {
		this.like = this.isLike
	},
	watch: {
		isLike(newValue) {
			this.like = newValue
		}
	},
	methods: {},
	props: {
		isLike: {
			type: Boolean,
			default: false
		},
		type: {
			type: String,
			default: ''
		},
		item: {
			type: Object,
			default() {
				return {}
			}
		}
	},
	methods: {
		likeTap() {
			this.setUpdateLike()
		},
		setUpdateLike() {
			uni.showLoading()
			this.$api.update_like({
				article_id: this.item._id
			}).then(data => {
				this.like = !this.like
				uni.hideLoading()
				// 收藏成功通知首页
				uni.$emit('update_article',this.type)
				uni.showToast({
					title: this.like ? '收藏成功': '取消收藏',
					icon: 'none'
				})
			}).catch(() => {
				uni.hideLoading()
			})
		},
	}
};
</script>

<style lang="scss" scoped>
// .like-icon {
// 	position: absolute;
// 	display: flex;
// 	align-items: center;
// 	justify-content: center;
// 	top: 0;
// 	right: 0;
// 	width: 20px;
// 	height: 20px;
// }
</style>
